<script type="text/html" template lay-done="layui.data.selfDepartmentdone(d);">
    <div class='temporary-pastHtml-content layui-form' lay-filter="personnel-of-unit">
        <div class="layui-row">
            <div class="layui-col-md12">
                <div class="layui-card-title">
                    <div class="layui-inline">
                        <label class="layui-form-label">姓名：</label>
                        <div class="layui-input-inline">
                            <input type="text" name="depart_man" class="layui-input custom-input-username" />
                        </div>
                        <div class="layui-input-inline">
                            <button type="button" class="layui-btn layui-btn-sm layui-btn-enquiry">查询</button>
                        </div>
                    </div>
                </div>
                <div>
                    <table id="self-table" lay-filter="self-company-table"></table>
                </div>
                <div class="group-check">
                    <div class="check-value-box" id="assignName">
                        {{# layui.each(d.params.persentMsg, function(index, item) {  }}
                            <div class="unit-content">
                                <a href="javascript:void(0)">{{item.writeusername}}</a>
                            </div>
                        {{#  }) }}
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-row" style="text-align: center;margin-top: 15px;">
            <textarea class="data-self-container" style="display: none;" name="" id="" cols="30" rows="10">
                    {{#
                        if(d.params.persentMsg) {
                    }}
                            {{JSON.stringify(d.params.persentMsg)}}
                    {{#
                        }else {
                    }}
                            []
                    {{#
                        }
                    }}
            </textarea> 
                <button type="button" class="layui-btn T-confirm">确认</button> 
        </div>
    </div>
</script>

<script type="text/html" id="assginTaskTpl">
    {{# layui.each(d, function(index, item) {  }}
        {{# var name = item.name || item.writeusername }}
        <div class="unit-content" data-usercode="{{item.user_code}}" data-certcode="{{item.cert_code}}" data-name="{{item.name}}" data-deptcode="{{item.dept_code}}" data-deptname="{{item.dept_name}}" data-deptid="{{item.dept_id}}">
            <a href="javascript:void(0);">{{name}}</a>
            <i class="layui-icon layui-icon-close del-tag" data-target="delName" data-usercode="{{item.user_code}}"></i>
        </div>
    {{#  }) }}
</script>

<style>
    .temporary-pastHtml-content {
        padding: 0px 10px;
    }
    .temporary-pastHtml-content .department-check,
    .temporary-pastHtml-content .group-check {
        height: 70px;
        border: 1px solid #ccc;
        margin: 15px 0px 0px 13px;
        padding: 2px 2px;
    }

    .temporary-pastHtml-content .check-value-box {
        width: 100%;
        height: 100%;
        overflow-y: auto;
    }

    .unit-content{
        display: inline-block;
        padding: 0 15px 0 5px;
        background-color: #ccc;
        position: relative;
        height: 24px;
        line-height: 24px;
    }
    .unit-content a:hover{
        text-decoration: underline;
    }
    .unit-content:hover i{
        visibility: visible;
        color: red;
        font-weight: bold;
    }
    .unit-content i {
        position: absolute;
        right: 0px;
        top: -2px;
        font-size: 14px;
        cursor: pointer;
        visibility: hidden;
    }
    ::-webkit-scrollbar{
        width: 4px;
        height: 4px;
    }
    ::-webkit-scrollbar-thumb{
        border-radius: 5px;
        -webkit-box-shaow: inset 0 0 5px rgba(0, 0, 0, 0.2);
        background: rgba(0,0,0,0.2);
    }
    ::-webkit-scrollbar-track{
        border-radius: 0;
        background: rgba(0,0,0,0.1);
    }
    .layui-card-title{
        height: 40px;
        line-height: 40px;
        margin-top: 5px;
    }
    .layui-card-title .layui-form-label{
        width: 45px;
    }
    .layui-btn-enquiry{
        width: 71px;
        text-align: right;
        background: url(../../dist/style/res/formFill/search.png) no-repeat 10px center;
        background-color: #77AF6F;
    }
</style>
<script>
    layui.data.selfDepartmentdone = function (d) {
        layui.use(['admin', 'table', 'form', 'laytpl'], function () {
            var admin = layui.admin,
                table = layui.table,
                form = layui.form,
                $ = layui.jquery,
                laytpl = layui.laytpl;

            var exSelf = d.params.persentMsg ? d.params.persentMsg : [],
                tableData = [];
            //人员表格加载
            function initTable(search){
                var username = $('.custom-input-username').val() || '',
                    params = {
                        "dept_code":layui.data('userdata').data.dept_code,
                    };
                search ? params.name = username : '';
                admin.req({
                    url: 'myapi/DC/api/rest/web/custom/GetUserByDeptid', 
                    type: 'post',
                    data: params,
                    success: function(res){
                        if(res.retcode == '0'){
                            var colData = []; 
                            layui.each(res.data, function(index, item){
                                var obj = {
                                    name: item.name,
                                    phone: item.phone,
                                    email: item.email,
                                    user_code: item.user_code,
                                    cert_code: item.cert_code,
                                    dataid: item.dataid,
                                    dept_code: item.dept_code,
                                    dept_name: item.dept_name,
                                    dept_id: item.dept_id
                                }
                                if(exSelf && exSelf.length > 0){
                                    for(var i = 0; i < exSelf.length; i++){
                                        if(exSelf[i].dataid == item.user_code || exSelf[i].user_code == item.user_code){
                                            obj.LAY_CHECKED = true;
                                        }
                                    }   
                                }
                                colData.push(obj);
                            });
                            table.render({
                                id: 'isSelf',
                                elem: '#self-table',
                                height: 420,
                                even: true,
                                limit: 100000,
                                cols: [[ 
                                    { type: 'numbers', title: '序号' },
                                    { type:'checkbox' },
                                    { field: 'name', title: '姓名', align: 'center' },
                                    { field: 'phone', title: '电话', align: 'center' },
                                    { field: 'email', title: '邮箱', align: 'center', minWidth: 200,
                                        templet: function(d){
                                            if(!!d.email){
                                                return '<span lay-tips='+d.email+'>'+d.email+'</span>'
                                            }
                                        }
                                    }
                                ]],
                                data: colData
                            })
                        }
                    }
                })      
            }

            initTable();

            //监听复选框
            table.on('checkbox(self-company-table)', function(obj){
                var checked = obj.checked,
                    checktype = obj.type,
                    $eachman = '';
                if(checktype == 'all'){
                    var allCheck = table.checkStatus('isSelf'),
                        isAll = allCheck.isAll;
                    if(isAll){
                        layui.each(allCheck.data, function(t, each){
                            JSON.stringify(exSelf).indexOf(JSON.stringify(each)) == -1 ? exSelf.push(each) : '';
                        });
                    }else{ 
                        var checkdata = table.cache["isSelf"];
                        layui.each(checkdata, function(index, item){
                            layui.each(exSelf, function(index2, content){
                                item.user_code == content.user_code && exSelf.splice(index2, 1);
                            });
                        });
                    }
                }else{
                    if(checked){ 
                        JSON.stringify(exSelf).indexOf(JSON.stringify(obj.data)) == -1 ? exSelf.push(obj.data) : '';
                    }else{ 
                        var removeUser = obj.data.user_code;
                        layui.each(exSelf, function(index, item){
                            item.user_code == removeUser &&  exSelf.splice(index, 1);
                        });
                    }
                }
                var getTpl = assginTaskTpl.innerHTML,
                    $view = document.getElementById('assignName');
                laytpl(getTpl).render(exSelf, function(html){
                    $view.innerHTML = html;
                });
            });

            //监听取消已选择的姓名
            $('#assignName').delegate('.unit-content .del-tag', 'click', function(){
                var target = $(this).data('target');
                if(target == 'delName'){
                    var usercode =  $(this).data('usercode');
                    layui.each(exSelf, function(index, item){
                        item.user_code == usercode && exSelf.splice(index, 1);
                    });
                    initTable(); 
                    var getTpl = assginTaskTpl.innerHTML,
                        $view = document.getElementById('assignName');
                    laytpl(getTpl).render(exSelf, function(html){
                        $view.innerHTML = html;
                    });
                }
            });

            //查询姓名
            $('.layui-btn-enquiry').bind('click', function(){
                initTable(true);
            });

        })
    }
</script>